/* 主结构 */
body{margin: 0;padding: 0;}
body :nth-child(1) *{transition: 0.5s;outline:none;}
body>div:nth-child(1){position: fixed;height: 100%;width: 100%;background-color: #A0E0F0;}
#divuserinfo{position: fixed;top: 0;left: 0;width: 100%;height: 7rem; background-color: #00FFFF;}
#divoperateui{position: fixed;top: 7rem;left: 0;width: 100%;height: 3rem;background-color: #4488FF;}
#divpicmanage{position: fixed;top: 10rem;left: calc(50% - 40rem);width: 80rem;height: calc(100% - 10rem);background-color: #AAFFFF;}

/* 布局结构 */
#divupload{position: absolute;overflow: hidden;width: 50%;height: 100%;left: 0; background-color: #66aa66;}
#divrecyclebin{position: absolute;overflow: hidden;width: 25%;height: 100%;left: 50%; background-color: #338833;}
#divblacklist{position: absolute;overflow: hidden;width: 25%;height: 100%;left: 75%; background-color: #882244;}
#divoperateui>div>.tag{position: absolute;bottom: 0;width: 100%;text-align: center;line-height: 3rem;vertical-align: middle;font-size: 2rem;font-family:"楷体";font-weight: 900;letter-spacing: 0.5rem;color: #f5f5f5;text-align: center;background-color: #0088FF;}
#divoperateui>div>.tag::before{content: attr(val);}
#divoperateui>div>.val{position: absolute;top: 3rem;background-color: #888833;height: 30rem;width: 100%;}
#divoperateui>div:hover{height: 33rem;}
#divoperateui>div:hover>.tag{color: #000000;letter-spacing: 1.5rem;font-size: 3rem;}

#divpicmanage>div{position: absolute;height: 100%;background-color: #66AA26;}
/* 32rem */
#divpiclist{width: 40%;}
#divpiclist>div>div{position: absolute; height: 100%;width: 105%;overflow: auto;}
/* 48rem */
#divpicinfo{left: 40%;border-left: 3px solid #ff8800;width: 60%;}

#divpicmanage>div>div[val]::before{content: attr(val);font-size: 3rem;font-family: "宋体";letter-spacing: 1rem;width: 100%;text-align: center;position: absolute;height: 6rem;vertical-align: bottom;line-height: 6rem;}
#divpicmanage>div>div[class="val"]{position: absolute;top: 6rem;background-color: #66bbaa;height: calc(100% - 6rem);width: 100%;}


/* 内容布局 */
#userheadpic{position: absolute;left: 4rem;height: 6rem;width: 6rem;background-color: #882244;top: 0.5rem;background-image: url(../img/12.jpg);background-size: 100% 100%;}
#divuserinfo>table{position: absolute;height: 95%;width: 70%;left: 14rem;}
#divuserinfo>tr{position: absolute;height: 100%;width: 60%;left: 14rem;}
#divuserinfo tr>td:nth-child(odd){font-weight: 900;font-size: 1.2rem;text-align: center;}
#divuserinfo tr>td:nth-child(even){border-bottom: 2px solid #000000;text-align: center;}
#divuserinfo tr>td button{width: 90%;min-width: 6rem;height: 70%;border-style: groove;font-size: 1.1rem;font-weight: 600;}
#divuserinfo tr>td button:active{border-style: ridge;}

.piclistnode{border-radius: 15%;box-shadow: 0.2rem 0.2rem 0.5rem #aaaaaa;width: 7rem;height: 7rem;border: 0.2rem solid #44aa88;float: left;margin: 1.6rem;background-image: url(../img/16.jpg);background-size: 100% 100%;}
.piclistnode:hover{box-shadow: 0.5rem 0.5rem 1.5rem #cccccc;}

#picinfo{text-align: center;}
#picdiv{height: 15rem;width: 15rem;margin: 1rem auto;border: 1px solid #888833;background-image: url(../img/16.jpg);background-size: 100% 100%;}
#divpicinfo span{font-size: 1.2rem;letter-spacing: 1rem;}
#divpicinfo textarea{margin: 1rem auto;font-size: 1.2rem;}

#authority{height: 2rem; width: 10rem;margin:0 auto  1.5rem ;position: relative;}
#authority>input{display: none;}
#authority>div{height: 2rem;width: 5rem;float: left;font-size: 1.2rem;line-height: 2rem;}
#authoritymb{position: absolute;top: 0;left: 0;background-color: rgba(150,150,200,0.3);border-radius: 20%;border: 1px solid #f80;}
#private:checked~#authoritymb{left: 50%;}
#public:checked~div>label[for=public],#private:checked~div>label[for=private]{color: #eeeeee;font-size: 1.5rem;}
.edit1{width: 8rem;height: 3rem;font-size: 2rem;line-height: 2.5rem;}
.edit2{width: 8rem;height: 3rem;font-size: 2rem;line-height: 2.5rem;}

/* 图片上传 */
#divupload>div>div{width: 40rem;height: 100%;margin: auto;position: relative;}
#divupload input[type=file]{background-color: #aaaaaa;}
#divupload>div>div>div{width: 50%;height: 100% ; background-color: #009999;float: left;text-align: center;}
#divupload>div>div>div:nth-child(1)>div{height: 12rem;width: 12rem;margin: 10% auto;border: 1px solid #000000;background-size: 100% 100%;}
#divupload>div>div>div:nth-child(2)>span{margin: 3% auto;display: inline-block;font-size: 1.1rem;}
#uploadbut{width: 10rem;}
/* 回收站 */
#divrecyclebin>.val>div{position: relative;height: 100%;width: 20rem;margin: auto;overflow: hidden;position: relative;}
#divrecyclebin>.val>div>div{position: absolute;height: calc(100% - 2rem);width: 105%;overflow: scroll;top: 0;left: 0;background-color: #009999;}
.recyclebinnode{height: 6rem;width: 100%;border-bottom: 2px solid #00FF00;border-top: 2px solid #00FF00;}
.recyclebinnode>div{float: left;height: 100%;}
.recyclebinnode>div:nth-child(1){width: 30%;}
.recyclebinnode>div:nth-child(1)>div{width: 80%;height: 80%;background-color: #ff88FF;margin: 10% auto; background-image: url(../img/13.jpg); background-size: 100% 100%;}
.recyclebinnode>div:nth-child(2){width: 60%;text-align: center;}
.recyclebinnode>div:nth-child(2)>span{di7play: inline-block;height: 50%;line-height: 1.5rem;font-size: 1.2rem;}
.recyclebinnode>div:nth-child(2)>span[red]{color: #cc0000;}
.recyclebinnode>div:nth-child(2)>button{width: 50%;height: 2rem;line-height: 2rem;}

/* 黑名单 */
#divblacklist>.val>div{position: relative;height: 100%;width: 20rem;margin: auto;overflow: hidden;position: relative;}
#divblacklist>.val>div>div{position: absolute;height: calc(100% - 2rem);width: 105%;overflow: scroll;top: 0;left: 0;background-color: #009999;}
.blacklistnode{height: 6rem;width: 100%;border-bottom: 2px solid #00FF00;border-top: 2px solid #00FF00;}
.blacklistnode>div{float: left;height: 100%;}
.blacklistnode>div:nth-child(1){width: 30%;}
.blacklistnode>div:nth-child(1)>div{width: 80%;height: 80%;background-color: #ff88FF;margin: 10% auto; background-image: url(../img/12.jpg); background-size: 100% 100%;}
.blacklistnode>div:nth-child(2){width: 60%;text-align: center;}
.blacklistnode>div:nth-child(2)>span{di7play: inline-block;height: 50%;line-height: 3rem;font-size: 1.1rem;}
.blacklistnode>div:nth-child(2)>button{width: 50%;height: 2rem;line-height: 2rem;}